
import 'package:boss/ui/widget/image/base_image.dart';
import 'package:hi_common/hi_common.dart';
import 'package:flutter/material.dart';

final Color _defaultBarrierColor = Colors.black.withOpacity(0.3);

Future<T> showModal<T>(
  BuildContext context, {
  @required WidgetBuilder builder,
  Color barrierColor,
  bool barrierDismissible = false,
  Duration transitionDuration = const Duration(milliseconds: 300),
  RouteTransitionsBuilder bodyTransitionBuilder = buildMaterialDialogTransitions,
  EdgeInsetsGeometry margin = EdgeInsets.zero,
  Color bodyColor = Colors.white,
  bool isShowCloseIcon = true,
}) async {
  return showGeneralDialog(
    context: context,
    pageBuilder: (context, animation, secondaryAnimation) {
      return ModalWrapper(
        builder: builder,
        duration: transitionDuration,
        animation: animation,
        secondaryAnimation: secondaryAnimation,
        bodyTransitionBuilder: bodyTransitionBuilder,
        margin: margin,
        bodyColor: bodyColor,
        isShowCloseIcon: isShowCloseIcon,
      );
    },
    barrierColor: barrierColor ?? _defaultBarrierColor,
    barrierDismissible: barrierDismissible,
    barrierLabel: MaterialLocalizations.of(context).modalBarrierDismissLabel ?? 'modalBarrierDismissLabel',
    transitionDuration: transitionDuration,
    transitionBuilder: buildMaterialDialogTransitions,
  );
}

class ModalWrapper extends StatefulWidget {
  final WidgetBuilder builder;
  final Duration duration;
  final Animation animation;
  final Animation secondaryAnimation;
  final RouteTransitionsBuilder bodyTransitionBuilder;
  final EdgeInsetsGeometry margin;
  final Color bodyColor;
  final bool isShowCloseIcon;

  const ModalWrapper({
    Key key,
    @required this.builder,
    @required this.duration,
    this.animation,
    this.secondaryAnimation,
    this.bodyTransitionBuilder,
    this.margin,
    this.bodyColor,
    this.isShowCloseIcon,
  }) : super(key: key);

  @override
  _ModalWrapperState createState() => _ModalWrapperState();
}

class _ModalWrapperState extends State<ModalWrapper> with SingleTickerProviderStateMixin {
  @override
  Widget build(BuildContext context) {
    var child = Material(
      type: MaterialType.transparency,
      child: AnimatedPadding(
        padding: MediaQuery.of(context).viewInsets,
        duration: Duration(milliseconds: 100),
        curve: Curves.decelerate,
        child: Column(
          children: <Widget>[
            Container(
              decoration: BoxDecoration(
                borderRadius: BorderRadius.circular(
                  20.w,
                ),
                color: widget.bodyColor,
              ),
              margin: widget.margin,
              child: widget.builder(context),
            ),
            if (widget.isShowCloseIcon)
              Container(
                margin: EdgeInsets.only(
                  top: 40.w,
                ),
                child: GestureDetector(
                  onTap: () {
                    Navigator.pop(GlobalPageContext.instance.context);
                  },
                  child: BaseImage(
                    'assets/image/modal_close_icon.png',
                    width: 80.w,
                    height: 80.w,
                  ),
                ),
              ),
          ],
        ),
      ),
    );

    return Column(
      mainAxisAlignment: MainAxisAlignment.center,
      mainAxisSize: MainAxisSize.min,
      children: <Widget>[
        Flexible(
          child: widget.bodyTransitionBuilder(
            context,
            widget.animation,
            widget.secondaryAnimation,
            Container(
              child: SingleChildScrollView(
                padding: const EdgeInsets.all(0),
                child: child,
              ),
            ),
          ),
        ),
      ],
    );
  }
}

class TranslateYTransition extends StatelessWidget {
  final Widget child;
  final Animation<double> animation;

  const TranslateYTransition({this.child, this.animation, Key key}) : super(key: key);

  @override
  Widget build(BuildContext context) {
    double _screenHeight = MediaQuery.of(context).size.height;

    return AnimatedBuilder(
      animation: CurvedAnimation(
        parent: animation,
        curve: Curves.decelerate,
      ),
      builder: (context, child) {
        return Transform.translate(
          offset: Offset(0, _screenHeight * (1 - animation.value)),
          child: child,
        );
      },
      child: child,
    );
  }
}

Widget buildMaterialDialogTransitions(
  BuildContext context,
  Animation<double> animation,
  Animation<double> secondaryAnimation,
  Widget child,
) {
  return FadeTransition(
    opacity: CurvedAnimation(
      parent: animation,
      curve: Curves.decelerate,
    ),
    child: child,
  );
}

Widget buildTranslateYTransition(
  BuildContext context,
  Animation<double> animation,
  Animation<double> secondaryAnimation,
  Widget child,
) {
  return TranslateYTransition(
    animation: animation,
    child: child,
  );
}
